{% extends "../base.html" %}
{% block title %}{{block.super}}注册{% endblock %}
{% block css %}{{block.super}}
    <link href="{{APPSTATIC}}css/login.css" rel="stylesheet">
{% endblock %}
{% block main %}
<div class="content-box">
    <h1>注册</h1>
    <form id="rigister" method="post">
        <input class="text" type="text" name="username" placeholder="用户名" value="{{username}}" required>
        <input class="text" type="password" name="password" placeholder="密码" required>
        <input class="text" type="password" id="pwd_confirm" placeholder="确认密码" required>
        <input class="text" type="email" name="email" placeholder="邮箱" value="{{email}}" required>
        {% comment %}<select name="role" id="role" class="text" required>
            <option value>身份</option>
            <option value="0">学生</option>
            <option value="1">教师</option>
        </select>{% endcomment %}
        <button type="submit" class="submit">注册</button>
        <p class="help-text">{{err}}</p>
    </form>
</div>
<script>
    {% if role %}
    role.value = {{role}};
    {% endif %}
    rigister.onsubmit = function(){
        if (this.password.value != pwd_confirm.value) {
            var helpText = document.querySelector('.help-text');
            helpText.innerHTML = "两次密码不一致";
            helpText.style.display = 'block';
            setTimeout(function(){
                helpText.style.display = 'none';
            }, 3000);
            return false;
        }
    };
</script>
{% endblock %}